@import "../../common/less/theme";
.goods{
	.g-header{
		position: fixed;
		top:0;
		left:0;
		width:100%;
		display: flex;
		justify-content: center;
		height: 88rpx;
		z-index: 10;
		.h-middle{
			display: flex;
			.m-item{
				position: relative;
				display: flex;
				align-items: center;
				color:#666;
				&:not(:first-child){
					margin-left: 34rpx;
				}
				&-active{
					text{
						color:#aa8a59;
					}
					&::after {
						position: absolute;
						content: '';
						bottom: 0;
						left: 0;
						width: 100%;
						height: 0;
						border-bottom: 3rpx solid #aa8a59;
					}
				}
			}
		}
		.h-right {
			position: absolute;
			top: 50%;
			right: 27rpx;
			transform: translateY(-50%);
			text{
				display: inline-block;
				width:60rpx;
				height: 60rpx;
				text-align: center;
				line-height: 60rpx;
				border-radius: 30px;
				font-size: 40rpx;
				background: RGBA(0, 0, 0, .1);
				color:white;
				&:first-child{
					margin-right:30rpx;
				}
			}
		}
	}
	.g-banner{
		swiper{
			height: 750rpx;
			.b-image{
				height: 100%;
				image{
					width:100%;
					height: 100%;
				}
			}
		}
	}
	.g-info{
		padding:28rpx;
		margin-bottom: 10rpx;
		background: white;
		.i-name{
			text{
				font-size: 34rpx;
				font-weight: 600;
				color:#333;
			}
		}
		.i-desc{
			padding:20rpx 0;
			text{
				color:#666;
			}
		}
		.i-price{
			.price-pay{
				display: flex;
				align-items: flex-end;
				text{
					&:nth-child(1){
						color:@primary-color;
					}
					&:nth-child(2){
						font-size: 40rpx;
						font-weight: 600;
						color:@primary-color;
					}
				}
			}
		}
	}
	.g-count {
		margin-bottom: 10rpx;
		background: white;
		.g-cell{
			display: flex;
			min-height: 80rpx;
			padding:0 28rpx;
			.c-left{
				display: flex;
				align-items: center;
				flex-basis: 93rpx;
				text{
					color:#666;
				}
			}
			.c-mid{
				display: flex;
				align-items: center;
				flex:1;
			}
			.c-right{
				display: flex;
				justify-content: flex-end;
				align-items: center;
				flex-basis: 40rpx;
				text{
					font-size: 24rpx;
					color:#666;
				}
			}
		}
	}
	.g-spec{
		margin-bottom:10rpx;
		background: white;
		.g-cell{
			display: flex;
			min-height: 80rpx;
			padding:0 28rpx;
			.c-left{
				display: flex;
				align-items: center;
				flex-basis: 93rpx;
				text{
					color:#666;
				}
			}
			.c-mid{
				display: flex;
				align-items: center;
				flex:1;
			}
			.c-right{
				display: flex;
				justify-content: flex-end;
				align-items: center;
				flex-basis: 40rpx;
				text{
					font-size: 24rpx;
					color:#666;
				}
			}
		}
	}
	.g-instruction{
		margin-bottom:10rpx;
		background: white;
		.g-cell{
			display: flex;
			min-height: 80rpx;
			padding:0 28rpx;
			.c-left{
				display: flex;
				align-items: center;
				flex-basis: 93rpx;
				text{
					color:#666;
				}
			}
			.c-mid{
				display: flex;
				align-items: center;
				flex:1;
				.instruction{
					padding:20rpx 0;
					.i-item{
						display: flex;
						.eosfont{
							font-size: 32rpx;
							color:#ab8959;
						}
						.text{
							padding-left:5rpx;
							color:#333;
						}
						&:not(:first-child){
							padding-top:20rpx;
						}
					}
				}
			}
			.c-right{
				display: flex;
				justify-content: flex-end;
				align-items: center;
				flex-basis: 40rpx;
				i{
					font-size: 24rpx;
					color:#666;
				}
			}
		}
	}
	.g-evaluate{
		margin-bottom: 10rpx;
		.e-header{
			display: flex;
			justify-content: space-between;
			align-items: center;
			height: 99rpx;
			padding:0 28px;
			background: white;
			.h-left{
				display: flex;
				align-items: center;
				text{
					font-weight: 600;
					color:#333;
				}
			}
			.h-right{
				display: flex;
				align-items: center;
				color:#aa8a59;
				text{
					font-size: 24rpx;
				}
			}
		}
		.e-content{
			background: white;
			.c-wrap {
				white-space: nowrap;
				.w-item {
					display: inline-block;
					width: 620rpx;
					height: 352rpx;
					margin-left: 28rpx;
					.e-card{
						height: 100%;
						box-sizing: border-box;
						padding:28rpx;
						background: #f8f8f8;
						.c-user{
							display: flex;
							align-items: center;
							.u-avatar{
								display: inline-block;
								height: 70rpx;
								width:70rpx;
								image{
									width:100%;
									height: 100%;
									border-radius: 50%;
								}
							}
							.u-name{
								padding:0 15rpx;
							}
							.u-star{
								display: flex;
								align-items: center;
								image{
									width:30rpx;
									height: 30rpx;
								}
							}
						}
						.c-text{
							padding-top:28rpx;
							text{
								white-space:normal;
								color:#333;
							}
						}
					}
					&:last-child{
						margin-right:.373rem;
					}
				}
			}
		}
		.e-footer{
			display: flex;
			justify-content: center;
			align-items: center;
			height: 99rpx;
			background: white;
			color:#aa8a59;
			text{
				font-size: 24rpx;
			}
		}
	}
	.g-details{
		margin-bottom: 115rpx;
		background: white;
		.d-tab{
			display: flex;
			align-items: center;
			justify-content: center;
			height: 83rpx;
			.t-item{
				text{
					color:#666;
				}
				&:not(:first-child){
					margin-left:88rpx;
				}
				&-active{
					text{
						font-weight: 700;
						color:#aa8a59;
					}
				}
			}
		}
		.d-content{
			.c-item{
				image{
					display: block;
					width: 100%;
					height: 200rpx;
				}
			}
		}
	}
	.g-footer{
		position: fixed;
		bottom:0;
		left:0;
		display: flex;
		height: 115rpx;
		width:100%;
		box-sizing: border-box;
		padding:0 28rpx;
		background: white;
		.f-left{
			display: flex;
			justify-content: space-around;
			flex:1;
			.l-item{
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				color:#666;
				.iconfont{
					font-size: 40rpx;
				}
			}
		}
		.f-right{
			display: flex;
			align-items: center;
			flex-grow: 0;
			.r-item{
				display: inline-block;
				width:222rpx;
				height: 68rpx;
				text-align: center;
				line-height: 68rpx;
				border-radius: 34rpx;
				text{
					color:white;
				}
				&-buy{
					background: #b60a0a;
				}
				&-cart{
					background: @primary-color;
				}
				&:nth-child(2){
					margin-left: 10rpx;
				}
			}
		}
	}
}
